﻿@model CS795.TravelAgency.Models.TripDetailsViewModel

@{
    ViewBag.Title = "Edit Trip";
}

@using (Html.BeginForm("Edit", "Trip", new { tripId = ViewBag.TripId }, FormMethod.Post, new { @class = "form-horizontal", role = "form" }))
{
    <hr />
    <div class="form-group">
        @Html.ActionLink("Back to Trips", "Trips", new { customerId = ViewBag.CustomerId })
    </div>
    
    <div class="form-group">
        @Html.LabelFor(m => m.Name, new { @class = "col-md-2 control-label" })
        <div class="col-md-10">
            @Html.TextBoxFor(m => m.Name, new { @class = "form-control", @readonly="readonly" })
        </div>
    </div>
    
    <div class="form-group">
        <div class="panel-heading">
            <strong>Car Rentals</strong>
        </div>
        <table class="table table-bordered table-condensed table-hover table-striped">
            <thead>
                <tr>
                    <th>Car Type</th>
                    <th>Vendor</th>
                    <th>Quote ID</th>
                    <th>Start Date</th>
                    <th>End Date</th>
                    <th>Price Per Day</th>
                    <th>Total Price</th>
                    <th>Status</th>
                    <th>Actions</th>
                </tr>
            </thead>
            <tbody id="car-rental-data">
                @Html.Partial("_CarRentalsPartial", Model.CarRentals)
            </tbody>
        </table>
        <button type="button" id="request-quote-car" class="btn btn-default">Request New Quotes</button>
    </div>
    
    <div class="form-group">
        <div class="panel-heading">
            <strong>Flights</strong>
        </div>
        <table class="table table-bordered table-condensed table-hover table-striped">
            <thead>
                <tr>
                    <th>Seat Type</th>
                    <th>Vendor</th>
                    <th>Quote ID</th>
                    <th>Date</th>
                    <th>Count</th>
                    <th>Departure</th>
                    <th>Destination</th>
                    <th>Price Per Seat</th>
                    <th>Total Price</th>
                    <th>Status</th>
                    <th>Actions</th>
                </tr>
            </thead>
            <tbody id="flight-data">
                @Html.Partial("_FlightsPartial", Model.Flights)
            </tbody>
        </table>
        <button type="button" id="request-quote-flight" class="btn btn-default">Request New Quotes</button>
    </div>
    
    <div class="form-group">
        <div class="panel-heading">
            <strong>Hotels</strong>
        </div>
        <table class="table table-bordered table-condensed table-hover table-striped">
            <thead>
                <tr>
                    <th>Room Type</th>
                    <th>Vendor</th>
                    <th>Quote ID</th>
                    <th>Check In</th>
                    <th>Check Out</th>
                    <th>Smoking?</th>
                    <th>Price Per Night</th>
                    <th>Total Price</th>
                    <th>Status</th>
                    <th>Actions</th>
                </tr>
            </thead>
            <tbody id="hotel-data">
                @Html.Partial("_HotelsPartial", Model.Hotels)
            </tbody>
        </table>
        <button type="button" id="request-quote-hotel" class="btn btn-default">Request New Quotes</button>
    </div>
}

<div id="request-quote-car-dlg" title="Request Car Rental Quotes"></div>
<div id="request-quote-flight-dlg" title="Request Flight Quotes"></div>
<div id="request-quote-hotel-dlg" title="Request Hotel Quotes"></div>
<div id="loading" title="Loading" class="hidden">
    <img src="" alt="Loading ..." />
</div>

@section scripts
{
    <script type="text/javascript">
        $('#request-quote-car').on("click", function () {
            $('#request-quote-car-dlg').dialog({
                autoOpen: true,
                position: { my: "center", at: "top+250", of: window },
                width: 500,
                resizable: false,
                title: 'Request Car Rental Quotes',
                modal: true,
                open: function (event, ui) {
                    $(this).load('@Url.Action("RequestCarRentalQuote", "Trip", new { tripId = ViewBag.TripId })');
                },
                buttons: {
                    OK: function () {
                        $('#request-quote-car-form').submit();
                        $(this).dialog('close');
                    },
                    Cancel: function () {
                        $(this).dialog('close');
                    }
                }
            });
            return false;
        });

        function CarRentalSuccess(html)
        {
            $('#car-rental-data').html(html);
        }

        $('#request-quote-flight').on("click", function () {
            $('#request-quote-flight-dlg').dialog({
                autoOpen: true,
                position: { my: "center", at: "top+250", of: window },
                width: 500,
                resizable: false,
                title: 'Request Flight Quotes',
                modal: true,
                open: function (event, ui) {
                    $(this).load('@Url.Action("RequestFlightQuote", "Trip", new { tripId = ViewBag.TripId })');
                },
                buttons: {
                    OK: function () {
                        $('#request-quote-flight-form').submit();
                        $(this).dialog('close');
                    },
                    Cancel: function () {
                        $(this).dialog('close');
                    }
                }
            });
            return false;
        });

        function FlightSuccess(html) {
            $('#flight-data').html(html);
        }

        $('#request-quote-hotel').on("click", function () {
            $('#request-quote-hotel-dlg').dialog({
                autoOpen: true,
                position: { my: "center", at: "top+250", of: window },
                width: 500,
                resizable: false,
                title: 'Request Hotel Quotes',
                modal: true,
                open: function (event, ui) {
                    $(this).load('@Url.Action("RequestHotelQuote", "Trip", new { tripId = ViewBag.TripId })');
                },
                buttons: {
                    OK: function () {
                        $('#request-quote-hotel-form').submit();
                        $(this).dialog('close');
                    },
                    Cancel: function () {
                        $(this).dialog('close');
                    }
                }
            });
            return false;
        });

        function HotelSuccess(html) {
            $('#hotel-data').html(html);
        }
    </script>
}